@import 'openmina';

.tab-group {
  @include flexRowVertCenter();

  .tab {
    min-width: 90px;
    max-width: 200px;
    width: 50%;
    text-align: center;
    border-radius: 6px;
    color: $base-secondary;
    transition: 0.2s;
    background-color: transparent;

    &.selected {
      background-color: $selected-container;
      color: $selected-primary;
    }

    &:hover:not(.selected) {
      background-color: $base-container;
    }
  }
}

.bar {
  div {
    height: 4px;
  }

  div:nth-child(1) {
    background-color: $success-primary;
  }

  div:nth-child(2) {
    background-color: $special-selected-alt-1-primary;
  }

  div:nth-child(3) {
    background-color: $warn-primary;
  }

  div:nth-child(4) {
    background-color: $base-tertiary;
  }
}

.mina-icon {
  font-variation-settings: 'FILL' 1 !important;
}
